<template>
	<div class="Echarts">
		<div id="main" style="width: 418px;height: 267px;"></div>
	</div>
</template>

<script>
	export default {
		name: 'Echarts',
		data() {
			return{
				cockpitData:[],
			}
		},
		mounted() {
			this.getList()
			
		},
		methods: {
			async getList(){
				var dt = {
					"params": {
							"normGuid": "627320d1-faba-4758-ab59-a3ff1bb4280b",
							"fieldList": []
						}
				};
				const aaa = await this.$api.post('dcockpit/rest/cockpitApi/searchListNormResult', dt)
				let {custom:{result}}={...aaa}
				this.cockpitData=result.cockpitData
				this.$nextTick(()=>{
					this.myEcharts();
				})
			},
			myEcharts() {
				// let picdata=[]
				// picdata[0]=this.cockpitData[0].pct
				// picdata[1]=this.cockpitData[1].pct
				// let maxpic=Math.max(...picdata)+50
				// let sqdata=[]
				// sqdata[0]=this.cockpitData[0].发明专利申请
				// sqdata[1]=this.cockpitData[1].发明专利申请
				// let maxsq=Math.max(...sqdata)+50
				
				// let squdata=[]
				// squdata[0]=this.cockpitData[0].发明专利授权
				// squdata[1]=this.cockpitData[1].发明专利授权
				// let maxsqu=Math.max(...squdata)+50
				console.log(this.cockpitData)
				let zdata=[]
				zdata[0]=this.cockpitData[0].发明专利申请
				zdata[1]=this.cockpitData[0].pct
				zdata[2]=this.cockpitData[0].发明专利授权
				let ndata=[]
				ndata[0]=this.cockpitData[1].发明专利申请
				ndata[1]=this.cockpitData[1].pct
				ndata[2]=this.cockpitData[1].发明专利授权
				let myChart = this.$echarts.init(document.getElementById('main'));

				//配置图表
				var option = {
					// backgroundColor: 'rgba(3, 16, 38, 0.71)',
					color:['#46BDF2','#F5C338'],
					tooltip: {},
					legend: {
						symbol: 'circle',
						left: 'left',
						orient: "vertical",
						left:10,
						itemWidth: 7,
						itemHeight: 7,
						top:10,
						textStyle: {
						      color: "#FFFFFF",
							  fontSize:16
						},
						icon: "circle"
					},
					radar: {
						center: ['50%', '58%'],
						radius: 90,
						startAngle: 90,
						splitNumber: 4,
						shape: 'circle',
						indicator: [{
								name: '发明专利申请\n累计数',
								// max: maxsq,
							},
							{
								name: 'PCT专利  \n申请累计数',
								// max:maxpic
							},
							{
								name: ' 发明专利\n授权累计数',
								// max: maxsqu
							},

						],
						// nameGap: 10,
						axisName:{
							fontSize: 15,
							color: '#DFF8FF',
							// align:'center',
							lineHeight: 18,
							padding: [10, 0, 0, 0],
							formatter:function(value, indicator){
								// console.log(maxsq)
								// return  '\n{value|' + value + '}';
								return  value;
							},
						},
						splitArea: {
							areaStyle: {
							          color: ['rgba(27, 103, 148, 1)', 'rgba(27, 103, 148, 0.8)', 'rgba(27, 103, 148, 0.6)', 'rgba(27, 103, 148, 0.3)'],
							          shadowColor: 'rgba(0, 0, 0, 0.2)',
							          shadowBlur: 10
							        }
						},
						axisLine: {
							lineStyle: {
								color: 'rgba(211, 253, 250, 0.8)',
							},
						},
						splitLine: {
							lineStyle: {
								color: 'rgba(211, 253, 250, 0.5)',
							},
						},
					},
					series: [{
						type: 'radar',
						data: [
							{
								name: '浙江',
								value: zdata,
								areaStyle: {
									color:'#46BDF2'
								}
							},
							{
								name: '宁波',
								value: ndata,
								areaStyle: {
									color:'#F5C338'
								}
							},
						],
					}, ],
				};
				myChart.setOption(option);
			}
		}
	}
</script>


<style>

</style>
